import { Component, OnInit } from '@angular/core';
import { NzMessageService } from 'ng-zorro-antd/message';
import { DatePipe } from '@angular/common';
import { CustomerJdcardService } from './customer-jdcard.service';

@Component({
  selector: 'app-customer-jdcard',
  templateUrl: './customer-jdcard.component.html',
  styleUrls: ['./customer-jdcard.component.scss'],
  providers: [DatePipe]
})
export class CustomerJdcardComponent implements OnInit {

  // #23A5D5 #E15B1C #204991 #E38813 #422575 #CD3738 #E14A53 #D63B7D
  // 面值筛选（可多选）：10、20、50、100、500、1000
  faceValueOptions: any = [
    { value: 10, label: '10', color: '#23A5D5', surplus: '剩余0张' },
    { value: 20, label: '20', color: '#E15B1C', surplus: '剩余0张' },
    { value: 50, label: '50', color: '#204991', surplus: '剩余0张' },
    { value: 100, label: '100', color: '#E38813', surplus: '剩余0张' },
    { value: 500, label: '500', color: '#422575', surplus: '剩余0张' },
    { value: 1000, label: '1000', color: '#CD3738', surplus: '剩余0张' },
  ];

  seachParams: any = {
    beginTime: '',
    endTime: '',
    no: '', // 综合搜索
    faceValue: '' // 面值
  };
  exchangeDates: any = [];
  faceValueSelected: any = [];

  tableParams: any = {
    tableLoading: false,
    page: 1,
    pageSize: 20,
    total: 0
  };
  tableData: any = [];

  constructor(
    private message: NzMessageService,
    private datePipe: DatePipe,
    private services: CustomerJdcardService
  ) { }

  ngOnInit(): void {
    this.loadTable();
  }

  async loadTable() {
    let params = {
      ...this.seachParams,
      page: this.tableParams.page,
      pageSize: this.tableParams.pageSize
    }
    this.tableParams.tableLoading = true;
    const res: any = await this.services.queryExchangeJdList(params);
    this.tableParams.tableLoading = false;

    if (res.code == 0) {
      const { surplusList, list } = res.data || {};
      this.tableData = list?.records || [];
      this.tableParams.total = list?.total || 0;

      if (surplusList && surplusList.length) {
        this.faceValueOptions.forEach((ele: any) => {
          surplusList.forEach((tag: any) => {
            if (ele.value == tag.faceValue) {
              ele.surplus = tag.number;
            }
          });
        });
      }
    } else {
      this.message.error(res.message);
    }
  }

  seachData() {
    this.tableParams.page = 1;
    this.loadTable();
  }
  resetData() {
    for (let key in this.seachParams) {
      this.seachParams[key] = '';
    }
    this.exchangeDates = [];
    this.faceValueSelected = [];
    this.tableParams.page = 1;
    this.loadTable();
  }

  // 面值change
  faceValueChange(result: any) {
    this.seachParams.faceValue = result.join(',');
  }

  onTimeChange(result: any) {
    this.seachParams.beginTime = result.length ? this.datePipe.transform(result[0], 'yyyy-MM-dd') : '';
    this.seachParams.endTime = result.length ? this.datePipe.transform(result[1], 'yyyy-MM-dd') : '';
  }

  // 当前页码改变时的回调函数
  onPageIndexChange(index: number) {
    this.tableParams.page = index;
    this.loadTable();
  }
  // 页数改变时的回调函数
  onPageSizeChange(sizeNum: number) {
    this.tableParams.page = 1;
    this.tableParams.pageSize = sizeNum;
    this.loadTable();
  }
}
